<template>
  <div class="related">
    <h2>相关商品</h2>
    <Item :renderData="this.$store.state.showProductList.slice(0, 4)"/>
  </div>
</template>

<script>
import Item from "@/components/product/item";
export default {
  data() {
    return {
      renderList: null,
    }
  },
  components: {
    Item
  },
  beforeMount() { // 设死数据
    this.allList = this.$store.state.zhilan;
    this.renderList = this.allList.slice(0, 5);
  },
}
</script>

<style lang="scss" scoped>
.related {
  width: 100%;
  height: auto;
  float: left;
  margin: 40px 0;
  h1, h2, h3, h4 {
    cursor: default;
    font-weight: 400;
  }
}

</style>